<html lang="java">
<head>
    <title>123</title>
    <script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
        window.onload = function () {
            var  myForm=  document.getElementById("myForm");

            var  loginName=  document.getElementById("loginName");
            var  sloginName=  document.getElementById("sloginName");
            loginName.onblur = checkloginName;
            function  checkloginName(){
               if (check(loginName,sloginName,"登录账号")){
                   var lname  =  "已经存在" + loginName.value;
                   if (sloginName.value === lname){
                       srePassword.innerHTML=lname;
                       loginName.focus();
                       return  false;
                   }
                   srePassword.innerHTML = "";
                   return  true;
               }

            }
                $(loginName).blur(function () {
                    var loginName_value =  $(this).val();

                        if (loginName_value === "" || loginName_value === null ){
                        $(sloginName).html("请输入登录账号");
                    }
                    else {
                        $.ajax({
                                url:"/record/checkLoginName",
                                data:"loginName="+loginName_value,
                                type:"post",
                                dataType:"json",
                                success:function (rs) {
                                    $(loginName).next().html(rs.massage);
                                    var  ms =   loginName_value+"已经存在";
                                    if (rs.massage === ms){
                                        $(loginName).focus();
                                    }
                                }
                            }
                        )
                    }
                });

            var  eName=  document.getElementById("eName");
            var  seName=  document.getElementById("seName");
            eName.onblur = checkeName;
            function  checkeName(){
                return   check(eName,seName,"员工姓名");
            }

            var  dId=  document.getElementById("dId");
            var  sdId=  document.getElementById("sdId");

            dId.onblur = checkdId;
            function  checkdId(){
                return   checkselect(dId,sdId,"所属部门");
            }
            var  rId=  document.getElementById("rId");
            var  srId=  document.getElementById("srId");
            rId.onblur = checkrId;
            function  checkrId(){
                return   checkselect(rId,srId,"选择职位");
            }
            var  eTel=  document.getElementById("eTel");
            var  seTel=  document.getElementById("seTel");
            eTel.onblur = checkeTel;
            function  checkeTel(){
                return   check(eTel,seTel,"手机号");
            }
            var  eQQ=  document.getElementById("eQQ");
            var  seQQ=  document.getElementById("seQQ");
            eQQ.onblur = checkeQQ;
            function  checkeQQ(){
                return   check(eQQ,seQQ,"QQ");
            }
            var  eAddress=  document.getElementById("eAddress");
            var  seAddress=  document.getElementById("seAddress");
            eAddress.onblur = checkeAddress;
            function  checkeAddress(){
                return   check(eAddress,seAddress,"家庭地址");
            }
            var  eBirthday=  document.getElementById("eBirthday");
            var  seBirthday=  document.getElementById("seBirthday");
            eBirthday.onblur = checkeBirthday;
            function  checkeBirthday(){
                return   checkselect(eBirthday,seBirthday,"出生日期");
            }
            var  eEntryTime=  document.getElementById("eEntryTime");
            var  seEntryTime=  document.getElementById("seEntryTime");
            eEntryTime.onblur = checkeEntryTime;
            function  checkeEntryTime(){
                return   checkselect(eEntryTime,seEntryTime,"入职日期");
            }
            var  newPassword=  document.getElementById("newPassword");
            var  snewPassword=  document.getElementById("snewPassword");
            newPassword.onblur = checknewPassword;
            function  checknewPassword(){
                return   check(newPassword,snewPassword,"登录密码");
            }
            var  rePassword=  document.getElementById("rePassword");
            var  srePassword=  document.getElementById("srePassword");
            rePassword.onblur = checkrePassword;
            function  checkrePassword(){
                return   check(rePassword,srePassword,"确认密码");
            }

            function  check(view,s,text){
                var value = view.value ;
                if(value==null ||value=="" ){
                    s.innerHTML=text+"不能为空";
                    view.focus();
                    return  false;
                }
                else{
                    s.innerHTML="";
                    return true;
                }
            }

            function  checkselect(view,s,text){
                var value = view.value ;
                if(value == 0  || value === null || value === ""){
                    s.innerHTML="请选择"+text;
                    view.focus();
                    return  false;
                }
                else{
                    s.innerHTML="";
                    return true;
                }
            }
            myForm.onsubmit = function () {

                if (checkloginName()&&checkeName() &&checkdId()&&checkrId()
                   &&checkeTel()&&checkeQQ()
                    && checkeAddress() &&checkeBirthday()&&checkeEntryTime()
                    && checknewPassword()&&checkrePassword()){
                    if (rePassword.value === newPassword.value){
                        return true;
                    }
                    else {
                        srePassword.innerHTML="两次密码不相同";
                        return  false;
                    }

                }
                else{
                    return  false;
                }
            }
        }
    </script>
    <style type="text/css">
        span{
            color:red ;
        }
        body
        {
            background-size: 100% 100%;
            height: 100%;
            width: 100%;
            text-align: center;
            margin-top: 50px;
            margin-left: auto;
        }
        table{
            text-align: center;
            margin: auto;
            text-decoration-color: #E3E6EB;
        }
        h1{
            font-size: 35px;
            color: #5d5a8b;
        }
    </style>
</head>
<body background="/static/img/1.jpg" >
<h1>添加员工</h1>
<form action="/record/insertemployee" method="post" id="myForm">
    <table cellpadding="4" cellspacing="1">
        <tr>
            <td>登录账号：</td>
            <td><input type="text"  name="loginName"  id="loginName"  autofocus  /><span id="sloginName"></span></td>
        </tr
        >
        <tr>
            <td>员工姓名：</td>
            <td><input type="text" value="" name="eName" id="eName" /><span id="seName"></span></td>
        </tr>

        <tr>
            <td>所属部门：</td>
            <td>
                <select name="dId" id="dId">
                    <option value="0">请选择</option>
                    <#list  departments as department>
                        <option value="${department.dId}">${department.dName}</option>
                    </#list>
                </select>
                <span id="sdId"></span>
            </td>
        </tr>
        <tr>
            <td>所属职位：</td>
            <td>
                <select name="rId" id="rId">
                    <option value="0">请选择</option>
                    <#list  roles as role>
                        <#if   currentUser.role.rLevel == 2>
                            <#if  role.rLevel  <   currentUser.role.rLevel >
                                <option value="${role.rId}">${role.rName}</option>
                            </#if>
                        </#if>
                        <#if   currentUser.role.rLevel == 3>
                                <option value="${role.rId}">${role.rName}</option>
                        </#if>
                    </#list>
                </select>
                <span id="srId"></span>
            </td>
        </tr>
        <tr>
            <td>性别：</td>
            <td>
                <select name="eSex" id="eSex">
                    <option>女</option>
                    <option>男</option>
                </select>
                <span id="seSex"></span>
            </td>
        </tr>
        <tr>
            <td>手机号：</td>
            <td><input type="text" value="" name="eTel" id="eTel"/><span id="seTel"></span></td>
        </tr>
        <tr>
            <td>QQ：</td>
            <td><input type="text" value="" name="eQQ" id="eQQ"/><span id="seQQ"></span></td>
        </tr>
        <tr>
            <td>家庭地址：</td>
            <td><input type="text" value="" name="eAddress" id="eAddress"/><span id="seAddress"></span></td>
        </tr>
        <tr>
            <td>出生日期：</td>
            <td><input type="date" value="" name="eBirthday" id="eBirthday"/><span id="seBirthday"></span></td>
        </tr>
        <tr>
            <td>入职日期：</td>
            <td><input type="date" value="" name="eEntryTime" id="eEntryTime"/><span id="seEntryTime"></span></td>
        </tr>
        <tr>
            <td>登录密码：</td>
            <td><input type="password" value="" name="ePassword" id="newPassword"/><span id="snewPassword"></span></td>
        </tr>
        <tr>
            <td>确认密码：</td>
            <td><input type="password" value="" id="rePassword"/><span id="srePassword"></span></td>
        </tr>
        <tr>
            <td colspan="2" style="text-align: center"><input type="submit" value="提交">
                <input type="button" value="返回" onclick="location.href='/record/selectemployee'"></td>
        </tr>
    </table>
</form>

</body>
</html>